<template>
   <PanelSplitTwo bottomToolbarHeight="0" :num="2">
    <template #top>
      <SetUserSelect
        :key="keys"
        class="queryForm"
        :formData="orderSelect"
        v-model:queryParams="paginationParams"
        @selectFunc="selectFunc"
      ></SetUserSelect>
    </template>
     <template #centerToolbar>
        <div class="vex_flex">
          <el-row :gutter="20" style="margin-bottom: 10px">
            <el-col :span="1.5">
              <el-button @click="handleQuery">新增</el-button>
            </el-col>
            <el-col :span="1.5">
              <el-button :disabled="selectedList.length !=1" @click="handleQuery(1)">查看</el-button>
            </el-col>
            <el-col :span="1.5">
              <el-button :disabled="selectedList.length !=1" @click="delFuns">禁用</el-button>
            </el-col>
            <el-col :span="1.5">
              <el-button :disabled="selectedList.length !=1" @click="delFuns(1)">启用</el-button>
            </el-col>
            <el-col :span="1.5">
              <el-button  @click="handleExport">导出</el-button>
            </el-col>
            <el-col :span="1.5">
              <el-button  @click="ImportingFiles">导入</el-button>
            </el-col>
          </el-row>
        <VxeTableGrid
          style="flex: 1;"
          :tableColumn="tableColumn"
          :tableLoading="tableLoading"
          :dataList="dataList"
          :showPagination="true"
          :paginationParams="paginationParams"
          @getList="setQueryParams"
          @selectedChange="selectedChange"
        >
        </VxeTableGrid>
      </div>
      <FileUploadNew ref="fileIstrue" url="/base/doctor/import" down="https://mkt.zjkqjt.com/profile/report/templates/doctor.xlsx" @succFun="succFun"></FileUploadNew>
     </template>
   </PanelSplitTwo>
</template>
<script setup lang="jsx">
  import {ref} from 'vue'
import { useRouter } from 'vue-router'
import { departmentList as getList } from "@/api/basicManagement/departmentMana";
import { hospitalList  } from "@/api/basicManagement/hospital";
import { doctorList, delDoctor, addenabled  } from "@/api/basicManagement/doctorMana";

import { ElMessageBox } from 'element-plus'
const { proxy } = getCurrentInstance();
const { doctor_mana_job, doctor_mana_status } = proxy.useDict("doctor_mana_job", "doctor_mana_status");

import datas from './data.js'

const keys = ref(0)
const Id = ref('')
const { paginationParams, orderSelect }  = datas
const tableColumn = ref([
  { type: "checkbox", width: 60, fixed: null },
  { field: "name", title: "名称" },
  { field: "sex", title: "性别",
  slots: { default: ({ row }, h) => {
    return row.sex == 0? '男' : '女'
  }} },
  { field: "hospitalName", title: "医院" },
  { field: "departmentName", title: "科室" },
  { field: "position", title: "职称" },
  { field: "specialField", title: "擅长邻域" },
  { field: "isDeleted", title: "是否禁用",
    slots: { default: ({ row }, h) => {
      return row.isDeleted == 1? '是' : '否'
    }}
  },
  { field: "status", title: "状态",
  slots: { default: ({ row }, h) => {
    return [<dict-tag options={ doctor_mana_status.value } value={ row.status }></dict-tag>]
  }} }
])

const handleExport = () => {
  proxy.download("/base/doctor/export", {
    ...paginationParams.value
  }, `config_${new Date().getTime()}.xlsx`);
}


const delFuns = (type) => {
  (type == 1? addenabled : delDoctor)(Id.value).then(() => {
    proxy.$modal.msgSuccess(`${type == 1?'启用':'禁用'}成功`);
    initDate()
  })
}

watch(
  doctor_mana_job,
  (newV, oldV) => {
    orderSelect[3].selectData = doctor_mana_job.value;
    keys.value = new Date().getTime();
  }
);


const router= useRouter ()



const pageSize = ref(10);
let tableLoading = ref(false)
const dataList = ref([
])

// 切换分页
  function setQueryParams(val) {
    paginationParams.value.pageNum = val.pageNum;
    paginationParams.value.pageSize = val.pageSize;
    initDate()
  }
  // 选择表格
  let selectedList = ref([])
  function selectedChange(val) {
    Id.value = val.currentItem.id
    selectedList.value = val.selectedList
    // this.form.customerId = val.currentItem.customerId;
  }
/** 搜索按钮操作 */
function handleQuery(type) {
  router.push({
    path: '/basicInformation/addDoctor',
    query: {
      id: type == 1? Id.value : ''
    }
  })
}
const getListFun = () => {
  Promise.all([getList({
    pageNum: 1,
    pageSize: 100000,
  }), hospitalList({
    pageNum: 1,
    pageSize: 100000,
  })]).then(result => {
    orderSelect[2].selectData = []
    result[0].rows.forEach((item) => {
      orderSelect[2].selectData.push({
        label: item.name,
        value: item.id
      })
    })
    orderSelect[1].selectData = []
    result[1].rows.forEach((item) => {
      orderSelect[1].selectData.push({
        label: item.name,
        value: item.id
      })
    })
    keys.value = new Date().getTime();
  })
}

getListFun()
const selectFunc = () => {
  paginationParams.value.pageNum = 1
  initDate()
}

const initDate = () => {
  doctorList({
    ...paginationParams.value,
    isDeletedtrue: true
  }).then((res) => {
    paginationParams.value.total = res.total
    dataList.value = res.rows
  })
}
initDate()
const fileIstrue = ref('fileIstrue')
const ImportingFiles = () => {
  // console.log('fasdg214235', fileIstrue.value)
  fileIstrue.value.openTure()
  // proxy.$refs.fileIstrue.openTure()
  
}
const succFun = (val) => {
  proxy.$modal.msgSuccess(`上传成功`);
  initDate()
}
</script>
<style scoped>
  .app-container {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 85px);
    overflow: hidden;
  }
  .vex_flex {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    height: 100%;
  }
  .flexmin {
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }
</style>